<!DOCTYPE html>
<html>
<head>
    <title>GetBook</title>
    <meta charset="UTF-8">
    <!-- import CSS -->
    <link rel="stylesheet" href="https://unpkg.com/element-ui@2.13.1/lib/theme-chalk/index.css">
    <style>
        [v-cloak]{display: none;}
    </style>
</head>
<body>
<div id="app" v-cloak>
    <el-container v-loading="loading"
                  element-loading-text="拼命加载中"
                  element-loading-spinner="el-icon-loading"
                  element-loading-background="rgba(0, 0, 0, 0.8)">
        <el-header>Get Book By <a target="_blank" href="https://www.qitxt.com/">https://www.qitxt.com/</a></el-header>
        <el-main>
            <el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm"  label-width="180px">
                <el-form-item label="下载地址" prop="startUrl">
                    <el-input v-model="ruleForm.downloadPath" placeholder="请输入路径"></el-input>
                </el-form-item>

                <el-form-item label="开始内容页面" prop="startUrl">
                    <el-input v-model="ruleForm.startUrl" placeholder="请输入路径"></el-input>
                </el-form-item>
                <el-form-item label="拉取间隔" prop="startUrl">
                    <el-input-number v-model="ruleForm.sleepSec" :min="0" :max="20" label="">
                        <template slot="append">秒</template>
                    </el-input-number>
                </el-form-item>
                <el-form-item label="">
                    <el-button @click="getBook('ruleForm')">Get</el-button>
                </el-form-item>
            </el-form>
        </el-main>
    </el-container>
    <p><a target="_blank" href="https://www.86wx.cc/">https://www.86wx.cc/</a></p>
    <p><a target="_blank" href="http://www.txt0871.com/">http://www.txt0871.com/</a></p>
    <p><a target="_blank" href="https://www.qitxt.com/">https://www.qitxt.com/</a></p>
    <p><a target="_blank" href="http://www.bookbenx.cc/">http://www.bookbenx.cc/</a></p>
    <p><a target="_blank" href="https://www.aiquxs.com/">https://www.aiquxs.com/</a></p>
    <p><a target="_blank" href="https://www.shuhaige.net/">https://www.shuhaige.net/</a></p>

</div>

<!-- import Vue before Element -->
<!--
<script src="https://unpkg.com/vue/dist/vue.js"></script>
-->
<!-- import JavaScript -->
<script crossorigin="anonymous" integrity="sha512-XdUZ5nrNkVySQBnnM5vzDqHai823Spoq1W3pJoQwomQja+o4Nw0Ew1ppxo5bhF2vMug6sfibhKWcNJsG8Vj9tg==" src="https://lib.baomitu.com/vue/2.6.14/vue.min.js"></script><script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>

<script>
    let vm = new Vue({
        el: '#app',


        data() {
            let data =  {
                loading:false,
                ruleForm:{
                    downloadPath:'C:/Users/Administrator/Desktop/',
                    startUrl:'https://www.qitxt.com/87/61987/19977558.html',
                    sleepSec:1,
                },
                rules: {
                    startUrl: [
                        { required: true, message: '请输入起始内容页', trigger: 'blur' }
                    ],
                    downloadPath: [
                        { required: true, message: '请输入地址地址', trigger: 'blur' }
                    ]
                }
            };

            let temp = this.getData();
            if(temp){
                data.ruleForm.downloadPath = temp.downloadPath;
                data.ruleForm.startUrl = temp.startUrl;
                data.ruleForm.sleepSec = temp.sleepSec;
            }

            return data;
        },
        methods:{
            getData(){
                let data = localStorage.getItem("ruleForm")
                if(data){
                    return JSON.parse(data);
                }
                return null;
            },
            setData(){
                let data = {};
                data.downloadPath = this.ruleForm.downloadPath;
                data.startUrl = this.ruleForm.startUrl;
                data.sleepSec = this.ruleForm.sleepSec;
                localStorage.setItem("ruleForm",JSON.stringify(data))
            },
            getBook(formName){
                let th = this;
                this.$refs[formName].validate((valid) => {
                    this.setData();
                    this.loading = true;
                    if (valid) {
                        $.ajax({
                            url: '/getBook',
                            type: 'post',
                            data:this.ruleForm,
                            success: function(data){
                                th.loading = false;
                                if(data.code==200){
                                    th.$message({
                                        message: '下载完成！',
                                        type: 'success'
                                    });
                                }else if(data.code == 500){
                                    th.$message.error('拉取错误！');
                                }else if(data.code == 501){
                                    th.$message.error('页面地址错误！');
                                }
                            }
                        });
                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            }
        }
    })
</script>
<style>
    .el-header, .el-footer {
        background-color: #B3C0D1;
        color: #333;
        text-align: center;
        line-height: 60px;
    }

    .el-aside {
        background-color: #D3DCE6;
        color: #333;
        text-align: center;
        line-height: 200px;
    }

    .el-main {
        background-color: #E9EEF3;
        color: #333;
        line-height: 160px;
    }

    body > .el-container {
        margin-bottom: 40px;
    }

    .el-container:nth-child(5) .el-aside,
    .el-container:nth-child(6) .el-aside {
        line-height: 260px;
    }

    .el-container:nth-child(7) .el-aside {
        line-height: 320px;
    }
</style>
</body>
</html>
